<extend name="Public:main_module" />
<block name="h1_title">角色管理</block>
<block name="small_title">后台管理角色列表</block>
<block name="other_headerinclude">
</block>
<block name="contents">			
<div class="form-group">
  <form class="navbar-form" role="search" action="" >
  	<div class="input-group pull-right no-margin">
	  <a href="#table-add" data-toggle="modal" >
	    <button class="btn btn-success">添加角色</button>
	  </a>
    </div>
    
    <label class="sr-only" for="findRole">查找角色:</label>
    <div class="input-group ">
      <input type="text" class="form-control" name="roleNameFilter" id="findRole" placeholder="{$roleNameFilter|default='查找角色...'}">
    </div>
                  
	<div class="input-group ">
      <button type="submit" class="btn btn-sm btn-info">
                          <i class="icon-ok"></i>
                          过滤
      </button>
    </div>  	
  </form>
</div>						

<div class="row" id="main_div">
	<div class="col-xs-12">
		<!-- PAGE CONTENT BEGINS -->

		<div class="row">
			<div class="col-xs-12">
				<div class="table-responsive">
					<table id="sample-table-1" class="table table-striped table-bordered table-hover">
						<thead>
							<tr>
								<th class="hidden-240">角色名</th>
								<th>角色描述</th>
								<th>权限</th>
								<th>状态</th>
								<th>操作</th>
							</tr>
						</thead>

						<tbody>
						
						<volist name="list" id="vo">
							<tr>

								<td class="hidden-240">
									<strong>{$vo.rname}</strong>
								</td>
								<td>{$vo.rinfo}</td>
								<td>{$vo.OAName|subtext=20}</td>
								<td>
								<?php 	$is_active	= '<span class="label label-sm label-success">已启用</span>';
										$not_active	= '<span class="label label-sm label-inverse arrowed-in">已禁用</span>';?>
								<a href="javascript:" onclick="ChangeStatus({$vo.id},{$vo.is_enabled})" id="is_enabled{$vo.id}">{$vo['is_enabled']?$is_active:$not_active}</a>	
								</td>
								<td>
									<div class="visible-md visible-lg hidden-sm hidden-xs btn-group">

										
										<button class="btn btn-xs btn-info">
											<a href="#table-alter" data-toggle="modal" onclick="getRole({$vo['id']})" style="color:#fff;" ><i class="icon-edit bigger-120">编辑</i></a>
										</button>
                                        

										<button id="id-btn-dialog2" class="btn btn-xs btn-danger">
											<i class="icon-trash bigger-120" onclick="deleteConfirm({$vo['id']})">删除</i>
										</button>

									</div>

									<div class="visible-xs visible-sm hidden-md hidden-lg">
										<div class="inline position-relative">
											<button class="btn btn-minier btn-primary dropdown-toggle" data-toggle="dropdown">
												<i class="icon-cog icon-only bigger-110"></i>
											</button>

											<ul class="dropdown-menu dropdown-only-icon dropdown-yellow pull-right dropdown-caret dropdown-close">
												<li>
													<a href="#" class="tooltip-info" data-rel="tooltip" title="View">
														<span class="blue">
															<i class="icon-zoom-in bigger-120"></i>
														</span>
													</a>
												</li>

												<li>
													<a href="#" class="tooltip-success" data-rel="tooltip" title="Edit">
														<span class="green">
															<i class="icon-edit bigger-120"></i>
														</span>
													</a>
												</li>

												<li>
													<a href="#" class="tooltip-error" data-rel="tooltip" title="Delete">
														<span class="red">
															<i class="icon-trash bigger-120"></i>
														</span>
													</a>
												</li>
											</ul>
										</div>
									</div>
								</td>
							</tr>
						</volist>

						</tbody>
					</table>
				</div><!-- /.table-responsive -->
				
				{$page}
							
			</div><!-- /span -->
		</div><!-- /row -->
		
		{:W('Windows/role_add')} 
		
		{:W('Windows/role_update')} 
			

		<div class="hr hr-18 dotted hr-double"></div>

	</div><!-- /.col -->
</div><!-- /.row -->
</block>						
<block name="bottom_js">
<!-- inline scripts related to this page -->

<script type="text/javascript">
	jQuery(function($) {
		
		$('table th input:checkbox').on('click' , function(){
			var that = this;
			$(this).closest('table').find('tr > td:first-child input:checkbox')
			.each(function(){
				this.checked = that.checked;
				$(this).closest('tr').toggleClass('selected');
			});
				
		});
	
	
		$('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});
		function tooltip_placement(context, source) {
			var $source = $(source);
			var $parent = $source.closest('table')
			var off1 = $parent.offset();
			var w1 = $parent.width();
	
			var off2 = $source.offset();
			var w2 = $source.width();
	
			if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
			return 'left';
		}
	})
	
	
	//复选框联动
	$(function () {  
	
		var _jgroupCons = $("[forcheckboxgroup]"), //所有具有 forcheckboxgroup 属性的元素  
			_jcheckboxs = $(":checkbox[group]"), //所有具有 group 属性的复选框  
			_checkgroups = new Array; //复选框组数组，该数组每一项保存一组由 _jcheckboxs 过滤的复选框组，组名称即是数组项的键  
	
		_jcheckboxs.each(function (i) {  
			var _groupname = $(this).attr("group"); //group 是非标准属性，必须由 attr 方法获得值，prop 方法不能获得  
			if (!_checkgroups[_groupname]) {  
				_checkgroups[_groupname] = _jcheckboxs.filter("[group='" + _groupname + "']");  
			}  
		});  
	
		//将所有与组关联的非复选框的元素设为无效  
		_jgroupCons.filter(":not(:checkbox)").prop("disabled", true).addClass("disabled");  
	
		_jgroupCons.filter(":checkbox")    //选择所有可以控制复选框组状态的复选框  
			.change(function () {  // 绑定 change 事件  
				var _jthis = $(this),  
					forgroupname = _jthis.attr("forcheckboxgroup"); //forcheckboxgroup 是非标准属性，必须由 attr 方法获得值，prop 方法不能获得  
				//点击此复选框后只做以下三件事：  
	
				// 1. 设置所控制的复选框组内所有复选框的状态  
				_jcheckboxs.filter("[group='" + forgroupname + "']").prop("checked", this.checked);  
	
				// 2. 设置与自己具有相同功能的复选框的状态  
				_jgroupCons.filter(":checkbox[forcheckboxgroup='" + forgroupname + "']").prop("checked", this.checked).prop("indeterminate", false);  
	
				// 3. 设置所有与该复选框组相关联的元素的状态  
				_jgroupCons.filter("[forcheckboxgroup='" + forgroupname + "']:not(:checkbox)").prop("disabled", !this.checked).toggleClass("disabled", !this.checked);  
			});  
	
		_jcheckboxs   //选择所有成组的复选框  
			.change(function () {  //绑定 change 事件  
				var _jthis = $(this),  
					_blnStat = this.checked, //此复选框的选中状态  
					_groupname = _jthis.attr("group"), //此复选框所属的组名称，非标准属性，必须由 attr 方法获得值，prop 方法不能获得  
					_checkedcount = _checkgroups[_groupname].filter("[checked]").length,//所在组处于选中状态的复选框数量  
					_blnEqual =  _checkedcount==0 || _checkedcount == _checkgroups[_groupname].length;    //该组所有成员的选中状态是否相同，即全都选中，或全都未选  
	
				//设置所有可控制该组状态的复选框的状态  
				_jgroupCons.filter(":checkbox[forcheckboxgroup='" + _groupname + "']").prop("checked", _blnStat).prop("indeterminate", !_blnEqual);  
	
				//设置所有与组关联的非复选框的元素状态  
				_jgroupCons.filter("[forcheckboxgroup='" + _groupname + "']:not(:checkbox)").prop("disabled", !(_blnStat || !_blnEqual)).toggleClass("disabled", !(_blnStat || !_blnEqual));  
			});  
	});  
	
	//改变角色状态
	function ChangeStatus(ids,active){
		var html_str	= active==1?'{$not_active}':'{$is_active}';
		$.get("__CONTROLLER__/role_update_status", { id: ids, is_enabled: active==1?0:1 },
		function(data){
			if(data){
				$("#is_enabled"+ids).html(html_str);
				$("#is_enabled"+ids).attr("onclick","ChangeStatus("+ids+","+(active==1?0:1)+")");
			}
		});		
	}
	
	//获取角色数据
	function getRole(ids){
		$.get("__CONTROLLER__/role_get_data", { id: ids},
		function(data){
			if(data){
				$("#uroleName").attr("value",data.rname);
				$("#uroleInfo").attr("value",data.rinfo);
				$("#uroleId").attr("value",data.id);
				$("label[name='usubOA']").children().each(  
					function(){  
						var temp	= $(this).children().attr("value");
						var arr		= data.oper_auth.split(",");
						if(arr.indexOf(temp)>=0){
							var res	= $(this).children().prop("checked",true);
						}
						else{
							$(this).children().prop("checked",false);
						}
					}  
				);
			}
			var chk	=  document.getElementsByName("parOAchk");	
			for(var i=0;i<chk.length;i++){
				document.getElementsByName("parOAchk")[i].checked=false;
			}
		});	
	}
	
	//删除角色确认
	function deleteConfirm(id){
		if(confirm("确定要删除该角色吗？")){
			window.location.href="__CONTROLLER__/deleteRole?id="+id;
		}
	}

</script>
</block>